<template>
  <el-dialog
    title="订单详情"
    :before-close="handleClose"
    v-if="model_data"
    :visible.sync="is_look">
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          商品：
        </div>
      </el-col>
      <el-col :span="20">
        <div v-for="item in model_data.wares">
          <div class="goodbox">
            <span class="goodimg mr15">
              <img :src="item.image" width="50" alt="">
            </span>
            <span>{{item.name}}</span>
          </div>
        </div>
      </el-col>
    </el-row>
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          订单号：
        </div>
      </el-col>
      <el-col :span="20">
        <span>{{model_data.order_sn}}</span>
      </el-col>
    </el-row>
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          发货方式：
        </div>
      </el-col>
      <el-col :span="20">
        <span v-if="model_data.send_type == 1">自行发货</span>
        <span v-if="model_data.send_type == 2">供应商发货</span>
      </el-col>
    </el-row>
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          物流：
        </div>
      </el-col>
      <el-col :span="20">
        <span>{{model_data.extension.shipping_name}}</span>
      </el-col>
    </el-row>
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          物流单号：
        </div>
      </el-col>
      <el-col :span="20">
        <span>{{model_data.extension.shipping_no}}</span>
      </el-col>
    </el-row>
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          联系信息：
        </div>
      </el-col>
      <el-col :span="20">
        <div>
          {{model_data.extension.consignee}}
        </div>
        <div class="silver mt10">
          {{model_data.extension.phone}}
        </div>
        <div class="silver mt10">
          {{model_data.extension.province}}{{model_data.extension.city}}{{model_data.extension.district}}{{model_data.extension.address}}
        </div>
      </el-col>
    </el-row>
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          抓取时间：
        </div>
      </el-col>
      <el-col :span="20">
        <span>{{model_data.created_at}}</span>
      </el-col>
    </el-row>
    <el-row class="pt15 pb15">
      <el-col :span="4">
        <div class="txt-right pr15 fwb">
          状态：
        </div>
      </el-col>
      <el-col :span="20">
        <div style="color:red;"
          v-if="model_data.status == 100">
          待发货
        </div>
        <div style="color:orange;"
          v-if="model_data.status == 200">
          已发货
        </div>
        <div style="color:green;"
          v-if="model_data.status == 1000">
          已完成
        </div>
      </el-col>
    </el-row>
  </el-dialog>
</template>

<script>
  export default {
    name: "order-model",
    props:['is_look','model_data'],
    methods:{
      handleClose:function(){
        this.$emit("closefn",false)
      }
    }
  }
</script>

<style scoped>
  .goodbox span {
    display: inline-block;
    vertical-align: middle;
    line-height:50px;
    font-size: 16px;
  }
  .goodbox span.goodimg{
    width:50px;height:50px;
  }
  .silver{
    color:#999;
  }
</style>
